// 初始样式
require('../../assets/css/index.less');
require('../../assets/css/basic.less');

// 小图标
require('../../assets/fonts/iconfont.css');

// 引入weui
require("../../lib/weui/weui.css");
const { default: axios } = require('axios');
var weui = require("../../lib/weui/weui.js");
// 当前页面样式
require('./persondata.less');


// 工具函数 utils
const dom = require('../../utils/dom');
const https = require('../../utils/https');
const local = require('../../utils/local');
dom.ready(function() {

    dom.addEvent(".picBtn", "click", function() {
        dom.getEle(".fileBtn").click()
    })



    // 换头像
    var imgUrl;
    dom.addEvent(".fileBtn", "change", function() {
        // console.log(this);
        var file = this.files[0];
        dom.upLoadPic("/api/shared/uploadPortrait", 'file', file, function(res) {
            console.log(222);
            var { errno, data } = res;
            if (errno == 0) {
                dom.getEle(".picBtn").src = 'http://fitness.h5.itsource.cn:3701' + data.url
                imgUrl = data.url
            }
        })
    })

    //  性别
    dom.addEvent("#sexBtn", "click", function() {
        weui.picker([{
            label: '男',
            value: 1
        }, {
            label: '女',
            value: 0
        }], {
            onConfirm: function(result) {
                dom.getEle("#sexBtn").innerHTML = result[0]['label']
            },
            title: '请选择性别',
            showClose: false
        });
    })

    //  生日
    dom.addEvent("#dateBtn", "click", function() {
        weui.datePicker({
            start: 1950,
            end: new Date().getFullYear(),
            onConfirm: function(result) {
                birData = result.map(v =>
                    dom.handleData(v.value)
                );
                // console.log(birData.join("-"));
                dom.getEle("#dateBtn").innerHTML = birData.join("-");
                // dom.getEle("#dateBtn").innerHTML = result[0]['value'] + "-" + result[1]['value'] + "-" + result[2]['value']
            },

            title: '请选择出生日期'
        });
    })

    // 省份
    var provinceData;
    dom.addEvent("#provinceBtn", "click", function() {
        https.get("/api/shared/province", function(res) {
            let { errno, data } = res;
            if (errno == 0) {
                // console.log(data);
                var copeData = data.map(v => {
                    return {
                        value: v.id,
                        label: v.name
                    }
                })
                weui.picker(copeData, {
                    onConfirm: function(result) {
                        // console.log(result[0]);
                        dom.getEle("#provinceBtn").innerHTML = result[0]['label']
                        provinceData = result[0]
                        console.log(provinceData);
                    },
                    title: '选择地址(省份)',
                    showClose: false
                });
            }
        })
    });


    //获取城市
    var cityTxt;
    dom.addEvent("#cityBtn", "click", function() {
        if (provinceData) {
            https.get("/api/shared/city?provinceId=" + provinceData.value, function(res) {
                let { errno, data } = res;
                if (errno == 0) {
                    // console.log(data);
                    var cityData = data.map(v => {
                        return {
                            value: v.id,
                            label: v.name
                        }
                    })
                    weui.picker(cityData, {
                        onConfirm: function(result) {
                            dom.getEle("#cityBtn").innerHTML = result[0]['label'];
                            cityTxt = result[0];
                            console.log(cityTxt);
                        },
                        title: '选择城市',
                        showClose: false
                    });
                }

            })

        } else {
            weui.alert("请先选择省份")
        }
    });
    //  输入框状态
    var textTex = dom.getEle(".textTex");
    var textTe = dom.getEle(".textTe");
    dom.addEvent("textarea", "input", function() {
        textTe.innerHTML = textTex.value.length;
        if (textTex.value.length >= 140) {
            textTex.value = textTex.value.slice(0, 139)
                // console.log(textT.value.slice(0, 20));
            textTe.innerHTML = 140
        }

    })

    dom.addEvent(".back", "click", function() {
        location.href = "./mine.html"
    });

    // 保存信息
    dom.addEvent(".button", "click", function() {
        https.post("/api/user/changeInfo", {
            nickName: dom.getEle(".nameTxt").value,
            gender: dom.getEle("#sexBtn").innerhtml == '男' ? 1 : 0,
            birthday: dom.getEle("#dateBtn").innerhtml,
            imgUrl: imgUrl,
            sign: textTex.value,
            provinceId: provinceData.value,
            cityId: cityTxt.value,
        }, function(res) {
            var { errno, data } = res
            console.log(res.data);
            if (errno == 0) {
                weui.toast("保存成功", 2000);
                local.set("tk", data.token);
                location.href = "./mine.html";
            } else {
                weui.toast("保存失败", 2000);

            }
        })
    });


    // 信息回填

    function rander() {
        //获取本地数据
        let { imgUrl, nickName, gender, birthday, sign, provinceId, cityId } = local.get('userData');
        //头像
        dom.getEle('.picBtn').src = 'http://fitness.h5.itsource.cn:3701' + imgUrl;
        imgUrl = imgUrl;
        //昵称
        dom.getEle('.nameTxt').value = nickName;
        //性别
        dom.getEle('#sexBtn').innerHTML = gender == 0 ? '女' : '男';
        //生日
        dom.getEle('#dateBtn').innerHTML = birthday;
        //个人简介
        dom.getEle('.textTex').value = sign;
        //  地址
        getPos('#provinceBtn', provinceId, '#cityBtn', cityId)

    }

    // 调用
    rander()


    //地址
    function getPos(obj1, pD, obj2, cD) {
        //查找省份
        https.get('/api/shared/province', function(res) {
            // console.log(res);
            if (res.errno == 0) {
                console.log(res.data);
                let pData = res.data.filter(v => {
                    return v.id == pD;
                });

                //设置省份到指定位置
                dom.getEle(obj1).innerHTML = pData[0].name;
                //把省份信息设置到全局变量中
                proviceData = {
                    label: pData[0].name,
                    value: pData[0].id
                };
                //查找城市
                https.get('/api/shared/city?provinceId=' + pData[0].id, function(res) {
                    if (res.errno == 0) {
                        // console.log(res.data);
                        //过滤出当前cityId对应的数据
                        let ccData = res.data.filter(v => {
                            return v.id == cD;
                        });
                        //设置省份到指定位置
                        dom.getEle(obj2).innerHTML = ccData[0].name;
                        //把城市信息设置到全局变量中
                        cData = {
                            label: ccData[0].name,
                            value: ccData[0].id
                        }
                    }
                })
            }
        })
    }
})